<template>
  <div class="hospital_cell">
    <nuxt-link :to="`/hospital/${info.id}`">
      <div class="image_box">
        <li-image :src="logo || info.logo" class="img" v-if="logo || info.logo"></li-image>
        <img src="@/assets/images/home/goods.png" class="img" alt="" v-else />
      </div>
    </nuxt-link>
    <nuxt-link :to="`/hospital/${info.id}`">
      <div class="hospital_name">
        {{ info.name }}
      </div>
    </nuxt-link>
    <div class="labels_list" v-if="info.featuredLabels && info.featuredLabels.length">
      <template v-for="(item, index) in info.featuredLabels || []">
        <div class="label" :class="getClassName(index)" :key="`label_${index}`" v-if="index < 3">
          {{ item }}
        </div>
      </template>
    </div>
    <div class="score_box">
      <div class="score">
        <!-- <el-rate v-model="info.initScore" class="li_rate" disabled allow-half></el-rate> -->
        <li-rate v-model="info.initScore" disabled></li-rate>
      </div>
      <div class="review">{{ info.commentCnt }}条评价</div>
    </div>
  </div>
</template>
<script>
import { Rate } from "element-ui";
export default {
  name: "Hospital",
  components: {
    [Rate.name]: Rate,
  },
  props: {
    info: {
      type: Object,
      default: function () {
        return {};
      },
    },
    logo: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      rate: 4,
    };
  },
  methods: {
    // 查看详情
    // lookDetail() {
    //   let o = this.info;
    //   let query = this.$route.query;
    //   query.id = o.id;
    //   this.$router.push({
    //     path: "/hospital/detail",
    //     query: { ...query },
    //   });
    // },

    // 动态获取className
    getClassName(index) {
      if (index % 3 == 0) {
        return "";
      }
      if (index % 3 == 1) {
        return "blue";
      }
      if (index % 3 == 2) {
        return "dark_blue";
      }
    },
  },
};
</script>
<style lang="less" scoped>
@import "./index.less";
</style>